در این مطلب میخوام سایتی رو بهتون معرفی کنم که در اون یک فریم ورک برای درست کردن قالب ایمیل واکنشگرا قرار داده شده و شما میتونین از قدرت اون بهره بگیرید و قالبهای مدنظرتون رو بسازید. این ابزار بر پایه Node.js هست و قابلیت های بسیار زیادی داره. روند کار به این صورته که شما در ابتدا با استفاده از زبان mjml که ساخته شده توسط همین ابزار هست، قالبتون رو تعریف میکنید و در نهایت با استفاده از ابزاری که وجود داره اون رو کامپایل کرده و تبدیل به html میکنید و میتونین از اون برای قالب ایمیل استفاده کنید. در آینده نزدیک احتمال داره که نحوه استفاده از این ابزار رو خدمتتون آموزش بدم.

برای شروع وارد سایت mjml بشین.

امیدوارم بدردتون بخوره.

موفق باشید.

یا علی

در این قسمت میخوام یک کد ( Browser in CSS ) جالب رو در اختیارتون بزارم.

همونطور که دیدید ظاهر و رابط کاربری یک مرورگر با استفاده از CSS ساخته شده و تمام امکانات اون شبیه سازی شده. این مرورگر شبیه به مرورگر کروم موجود بر روی سیستم عامل Mac هست. میتونین از این کد ایده گرفته و از اون استفاده کنید.

بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین اونو دانلود کرده و استفاده کنید. امیدوارم لذت برده باشین.

موفق باشید.

یا علی

Source

به نام خدا، سلام. در این جلسه صفحه پروفایل کاربری رو تکمیل می کنیم. مطالب مطرح شده در این جلسه عبارتند از :

• Linear Layout و attribute های آن
• ساختن رابط کاربری با XML و تشریح اجزای مختلف رابط کاربری
• Edit texts
  • آشنایی با attribute های xml برای EditText
  • اضافه کردن TextWatcher به EditText
• Buttons
  • آشنایی با attribute های xml برای Button
  • کار با Event های کاربردی آن
• Checkbox
  • آشنایی با attribute های xml برای Checkbox
  • کار با Event های کاربردی آن
• Radio Buttons
  • آشنایی با attribute های xml برای Radio button
  • کار با Event های کاربردی آن
• آموزش اضافه کردن فونت به پروژه و آشنایی با کلاس Typeface
  • اعمال کردن فونت های مختلف روی View های Textview, Button, EditText و ...

توضیحات : سیستم عامل اندروید، با بیش از یک میلیارد کاربر در دنیا بالغ بر 70 درصد سهم سیستم عامل های تلفن های همراه را به خود اختصاص داده است. همین موضوع باعث شده تا بازار کاری با پتانسیل بالا برای برنامه نویسی اندروید ایجاد گردد. با توجه به استقبال کاربران و درخواست های مکرر شما دوستان عزیز سعی کردیم دوره ای جامع و کامل را در زمینه برنامه نویسی اندروید برگزار نماییم. در این دوره تمامی مفاهیم مقدماتی تا پیشرفته اندروید را به صورت کاملا پروژه محور آموزش خواهیم داد. پس از گذراندن این دوره می توانید هر برنامه و اپ اندرویدی که می خواهید، با بهترین کیفیت و آخرین تکنولوژی های روز تولید کنید. این دوره طوری طراحی شده که تمام نیازهای بازار کار را پاسخگو می باشد. زبان برنامه نویسی استفاده شده در این دوره جاواست که بهینه ترین، پر سرعت ترین و با کیفیت ترین اپ های اندروید را با آن می توان تولید کرد و گوگل این روش را با آخرین به روزرسانی ها به بهترین شکل پشتیبانی می کند. برای گذراندن این دوره، نیاز به تجربه برنامه نویسی پیشرفته ندارید، ما سعی کردیم اکثر مفاهیم مورد نیاز شما را در جلسات ابتدایی آموزش دهیم. این دوره نیز بر اساس اصل قیمت گذاری منصفانه در سون لرن با هزینه ای بسیار کمتر از آنچه در دوره های حضوری می پردازید در دسترس شما خواهد بود.

در این قسمت میخوام یک کد ( baby ) جالب رو در اختیارتون بزارم.

همونطور که دیدید یک نوزاد جالب با استفاده از CSS و HTML ساخته شده و بصورت انیمشنی نمایش داده شده.

بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین اونو دانلود کرده و استفاده کنید. امیدوارم لذت برده باشین.

موفق باشید.

یا علی

Source

در این مطلب میخوام سایتی رو بهتون معرفی کنم که در اون ابزاری قرار داده شده که با استفاده از اون میتونین برای عکسهای خودتون فیلترهای زیبایی با استفاده از CSS قرار بدین و سایتتون رو زیباتر کنید. در بالای سایتی که لینکشو قرار دادم تعدادی مثال قرار داده شده که با هاور کردن بر روی هر کدام حالت اصلی عکس نمایش داده میشه. در آخر هم طرز استفاده از این ابزار رو گفته و میتونین از اون استفاده کنید.

برای شروع وارد سایت cssco بشین.

امیدوارم بدردتون بخوره.

موفق باشید.

یا علی

در این قسمت میخوام یک کد ( Bubble Menu ) جالب رو در اختیارتون بزارم.

همونطور که دیدید یک منوی حبابی و بسیار زیبا ساخته شده و قرار گرفته و زمانی که بر روی اون هاور میکنید بصورت بسیار زیبا از هم جدا میشن و زیر هم قرار میگیرن و دوباره با بیرون بردن ماوس از روی اونا، سر جای اولشون بر میگردن.

بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین اونو دانلود کرده و استفاده کنید. امیدوارم لذت برده باشین.

موفق باشید.

یا علی

Source

در این مطلب میخوام سایتی رو بهتون معرفی کنم که در اون یک ویرایشگر قدرتمند متن برای کتابخانه React رو معرفی کرده و میتونین با استفاده از این ابزار محبوب و قوی، ویرایشگری رو در سایتتون قرار بدین که خیلی بهینه و عالی، متونی که کاربرانتون میخان رو درونش قرار بدن و در سایتتون انتشار بدن. این ویرایشگر پشتیبانی خوبی از مرورگرها داره و همچنین میتونین دستکاری های زیادی در اون انجام بدین تا متناسب با طرح و قابلیت های سایتتون بشه.

برای شروع وارد سایت draft-js بشین.

امیدوارم بدردتون بخوره.

موفق باشید.

یا علی

- - , .
.

در این مطلب میخوام سایتی رو بهتون معرفی کنم که در اون یک ابزار قرار داده شده که با استفاده از اون میتونین کدهای CSS رو درون کدهای Javascript بنویسید و استایل صفحه رو تغییر بدین. به این صورت دیگه میتونین از قدرت محاسبه Javascript استفاده کنید و متناسب با شرایط کدهای CSS مختلفی رو اجرا کنید. این کدها میتونن در لحظه عوض بشن و کارای جالبی رو برای شما انجام بدن. این ابزار تقریبا کاری همانند preprocessor مثل sass رو برای شما انجام میده.

برای شروع وارد سایت descartes بشین.

امیدوارم بدردتون بخوره.

موفق باشید.

یا علی

- - , .
.

در این قسمت میخوام یک کد ( Cog loading animation ) جالب رو در اختیارتون بزارم.

همونطور که دیدید یک لودینگ بسیار زیبا و بصورت چرخ دنده ساخته شده و قرار گرفته. این کار با استفاده از CSS صورت گرفته و میتونین از اون در سایت خودتون استفاده کنید و یا تغییراتی در اون بوجود بیارید.

بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین اونو دانلود کرده و استفاده کنید. امیدوارم لذت برده باشین.

موفق باشید.

یا علی

Source

- - , .
.

در این قسمت میخوام یک کد ( Author Quote ) جالب رو در اختیارتون بزارم.

همونطور که دیدید استایلی زیبا و حرفه ای برای نقل قولها قرار داده شده و شما میتونین از اون ایده گرفته و در سایتتون از اون استفاده کنید. با کلیک بر روی > و < میتونین به بعدی و قبلی برید.

بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین اونو دانلود کرده و استفاده کنید. امیدوارم لذت برده باشین.

موفق باشید.

یا علی

Source

- - , .
.

در این مطلب میخوام سایتی رو بهتون معرفی کنم که از نظر طراحی و رابط کاربری فوق العاده هست و میتونین از اون ایده های زیادی رو بگیرید. وقتی که بین صفحات سایت جابجا میشید افکتهای بسیار زیبایی اجرا میشه که واقعا آدم رو به وجد میاره. پیشنهاد میکنم چرخی در سایت بزنید تا با قابلیت های اون آشنا بشید.

برای شروع وارد سایت wonderlandindustry بشین.

امیدوارم بدردتون بخوره.

موفق باشید.

یا علی

- - , .
.

در این مطلب با ادامه آموزش Google Maps در خدمتتون هستیم.

علاوه بر marker یا نشانه، چند ضلعی، دایره، مستطیل و بقیه اشکال موجود، ما همچنین میتونیم باکسها یا پنجره های اطلاعاتی یا Info Windows رو بر روی نقشه نمایش بدیم و با استفاده از اون، متنی رو به کاربر نمایش بدیم. این مطلب به شما آموزش میده که چطور از Info Windows استفاده کنید و نقشتون رو پیشرفته تر کنید.

اضافه کردن یک Window

Info Windows برای افزودن هر گونه متن و اطلاعاتی به نقشه مورد استفاده قرار میگیره. برای مثال، اگر شما بخواید اطلاعاتی در مورد یک نقطه خاص بر روی نقشه قرار بدید، شما میتونین از Info Window استفاده کنید. بطور معمول و عمدتا Info Window به نشانه یا Marker متصل و ربط داده میشه. شما میتونین برای ساختن یک Info Window یک نمونه جدید از شئ google.maps.InfoWindow رو بسازید. این مورد ویژگی های زیر رو پوشش میده:

• Content : با استفاده از این ویژگی میتونین رشته متنی که قصد دارید در Window نمایش داده بشه رو مشخص کنید.
• position : با استفاده از این ویژگی میتونین مختصات جغرافیایی نقطه ای که میخاید Window در اونجا نمایش داده بشه رو مشخص کنید.
• maxWidth : بصورت پیش فرض Widnow به اندازه ای طولش زیاد میشه که تمام محتویاتش رو نمایش بده، اما شما میتونین برای اون یک ماکزیمم مشخص کنید که از اون بیشتر نشه.

مثال زیر رو ببینید:

خروجی:

همچنین شما میتونین یک Info Window رو به یک نشانه یا Marker نسبت بدین و هر کاری که با Marker صورت بگیره، Info Window هم رفتار متناسب با اون نمایش میده. برای مثال کد زیر رو ببینید:

خروجی بصورت زیر هست:

همونطور که دیدید با درگ کردن نشانه، Window نیز همراه با اون جابجا میشه. همونطور که دیدید در ویژگی content میتونیم کدهای HTML هم وارد کنیم و درون Window نمایش بدیم. شما میتونین خودتون کد CSS هم قرار بدین و به این کدها استایل بدین. در نهایت با استفاده از کد زیر Window را به Marker متصل کردیم:

همونطور که دیدید با استفاده از open، باکس infoWindow ساخته شده رو به نشانه موجود بر روی نقشه نسبت دادیم. چون که این کار رو انجام دادیم و اون نشانه خودش مختصات داره، دیگه لازم نیس که برای Window خودمون از ویژگی position استفاده کنیم.

در جلسات بعدی بیشتر در مورد این ابزار قدرتمند گوگل صحبت میکنیم.

امیدوارم از این جلسه خوشتون اومده باشه.

موفق باشید

یا علی

Source

- - , .
.

در این مطلب با ادامه آموزش Google Maps در خدمتتون هستیم.

در جلسات قبلی در مورد اضافه کردن نشانه یا Marker و تغیییر و دستکاری در اون توضیح دادیم و شما رو با امکانات و قابلیتهای اون آشنا کردیم. علاوه بر اضافه کردن Marker شما میتونین اشکال هندسی مختلفی نظیر چندخطی ها، چند ضلعی ها، مستطیل و دایره و ... رو نیز به نقشتون و نقطه دلخواهتون اضافه کنید. در این جلسه و جلسه بعد، اشکال مهمی که میتونین به نقشه اضافه کنید رو بهتون آموزش میدیم.

چندخطی ها یا Polylines

با استفاده از قابلیت اضافه کردن Polylines که نقشه گوگل در اختیار ما قرار داده، میتونیم مسیرهایی رو بر روی نقشه مشخص کنیم. شما میتونین با استفاده از نمونه ساختن از شئ google.maps.polyline این کار رو انجام بدین. همچنین در زمان ساخت نمونه باید مقادیر مناسبی رو برای ویژگی های هر مسیر قرار بدیم. همانند جلسه قبل که با استفاده از متد setMap، نشانگر رو به نقشه متصل میکردیم، اینجا نیز به همین صورت عمل میکنیم.

در اینجا میخایم یک مثال رو براتون بزنیم که در اون 3 خط قرار گرفته و 4 نقطه نیویورک در آمریکا، لندن در انگلیس، دهلی نو در هند و پکن در چین رو به هم وصل کرده. برای اینکار بصورت زیر عمل میکنیم:

خروجی بصورت زیر خواهد بود:

همونطور که دیدید خطوطی بین چهار مکانی که عرض کردم، رسم شده. برای این کار کدهای زیر استفاده شده:

میبینید که یک نمونه جدید از شئ google.maps.polyline ساخته شده و درون ویژگی path اون 4 نقطه ای که مد نظرمون هست رو وارد کردیم. بعد از اون از ویژگی های دیگه ای استفاده کردیم که ظاهر خطوط رو مشخص کنه. با strokeColor رنگ خطوط رو مشخص میکنیم، با strokeOpacity شفافیت خطوط رو مشخص میکنیم و با strokeWeight هم ضخامت خطوط رو مشخص میکنیم.

چندضلعی یا Polygon

با استفاده از چندضلعی ها میتونین ناحیه ای رو با استفاده از چند ضلعی انتخاب کنید و رنگ اونا رو عوض کنید و به این صورت به کاربران نشون بدید که شما این محدوده مد نظرتون هست. برای اینکار باید یک نمونه از شئ google.maps.Polygon بسازیم. حالا میخایم مثالی رو در اختیارتون قرار بدیم که در اون سه تا از شهرهای هند رو در اون مشخص کنیم. برای این کار بصورت زیر عمل میکنیم:

خروجی بصورت زیر خواهد بود:

همونطور که دیدید یک سه ضلعی مشخص شده. برای این کار کدهای زیر استفاده شده:

میبینید که یک نمونه جدید از شئ google.maps.polygon ساخته شده و درون ویژگی path اون 3 نقطه ای که مد نظرمون هست رو وارد کردیم. نقاط بیشتری رو هم اگه بخوایم میتونیم وارد کنیم. بعد از اون با استفاده از ویژگی fillColor رنگ درونی ناحیه رو مشخص کردیم و با استفاده از ویژگی fillOpacity هم شفافیت اون رو تعریف کردیم.

در جلسات بعدی بیشتر در مورد این ابزار قدرتمند گوگل صحبت میکنیم.

امیدوارم از این جلسه خوشتون اومده باشه.

موفق باشید

یا علی

Source

- - , .
.

به نام خدا و سلام. اعتباری که در سیستم VIP برای کاربرامون در نظر می گیریم باید این قابلیت رو داشته باشه که به روز های دلخواه (واحد های زمانی دلخواه) قابل اضافه کردن یا حذف کردن رو داشته باشه. همین مورد ما این قابلیت رو به صورت تمام و کمال در سیستم پلاگین VIP پیاده سازی می کنیم. اعتبار کاربران می تونه هم کاهش پیدا کنه و هم افزایش پیدا کنه.ما در یک صفحه مجزا این قابلیت رو پیاده سازی می کنیم و و کاربر مدیر با مشخص کردن نوع تغییر اعتبار و وارد کردن تعداد روز های مورد نظر اعتبار کاربر رو تغییر میده. در این جلسه خواهیم دید:

• ایجاد صفحه html تغییر اعتبار کاربر
• بررسی روش های موجود برای تغییر اعتبار کاربر
• ذخیره سازی اعتبار جدید

توضیحات : وردپرس به عنوان محبوب ترین سیستم مدیریت محتوا در بین اکثر کاربران فضای مجازی به خوبی شناخته شده است و این موضوع باعث شده تا سیستم های مختلفی برای وردپرس تهیه و به بازار عرضه شود. هر چند وردپرس خود رایگان است اما قابلیت های توسعه آن از جمله قالب ها و پلاگین ها که به کاربران کمک می کند سیستم مورد نظر خود را پیاده سازی کنند، باعث شده است تا رونق بسیار زیادی در بازار فروش قالب ها و پلاگین های آن ایجاد شود. فروش هایی که تا دهها میلیون دلار هم برای یک افزونه می رسد! در این دوره سعی کرده ایم تمامی مواردی که شما برای تهیه یک پلاگین عالی و کاملا حرفه ای نیاز دارد را قرار دهیم و تدریس نماییم. آموزش ها به صورت کاملا پروژه محور و کاربردی تهیه شده است، پلاگین هایی حرفه ای که هم نحوه ایجاد و کدنویسی آنها را یاد خواهید گرفت و هم آنها را در پایان دوره خواهید داشت. شما پس از گذراندن این دوره قادر خواهید بود هر نوع پلاگین دلخواه دیگری را که فکر می کنید برای سایت خود بنویسید. لازم به ذکر است در صورت سفارش پلاگین های طراحی و کدنویسی شده در این دوره، باید هزینه ای حداقل 800 هزارتومانی بپردازید! در صورتی که در این دوره شما فقط با پرداخت هزینه ای اندک، هم پلاگین نویسی حرفه ای خواهید شد و هم این پلاگین ها را در پایان دوره خواهید داشت. تدریس مباحث این دوره نیز به مانند دوره های دیگر سون لرن، بر اساس اصل صداقت در تدریس و جامع بودن دوره هاست و مدرس تمامی تجربیات حرفه ای خود در این زمینه را به شما انتقال خواهد داد! به جرئت می توانیم ادعا کنیم دوره حاضر حرفه ای ترین و استانداردترین دوره پلاگین نویسی وردپرس است که در سطح ایران برگزار می گردد. پس فرصت را از دست ندهید و خود را به یک پلاگین نویس حرفه ای وردپرس تبدیل کنید!

- - , .
.

به نام خدا، سلام. توی این جلسه می خواهیم صفحه پروفایل کاربری رو به همراه هم پیاده سازی کنیم. برای پیاده سازی رابط کاربری در اندروید از xml استفاده می کنیم، بنابراین ابتدا با ساختار xml آشنا می شویم. بعد از آن با view های مختلف کار خواهیم کرد. مطالب مطرح شده در این جلسه عبارتند از :

• آشنایی با ساختار Xml و کاربردهای آن
• معرفی Relative layout
• معرفی Image Button
• معرفی TextView
• معرفی Button
• معرفی Imageview
• معرفی Toast
• ست کردن رویداد کلیک بر روی view های مختلف
• معرفی استاندارد های مختلف اندازه گیری اندروید

توضیحات : سیستم عامل اندروید، با بیش از یک میلیارد کاربر در دنیا بالغ بر 70 درصد سهم سیستم عامل های تلفن های همراه را به خود اختصاص داده است. همین موضوع باعث شده تا بازار کاری با پتانسیل بالا برای برنامه نویسی اندروید ایجاد گردد. با توجه به استقبال کاربران و درخواست های مکرر شما دوستان عزیز سعی کردیم دوره ای جامع و کامل را در زمینه برنامه نویسی اندروید برگزار نماییم. در این دوره تمامی مفاهیم مقدماتی تا پیشرفته اندروید را به صورت کاملا پروژه محور آموزش خواهیم داد. پس از گذراندن این دوره می توانید هر برنامه و اپ اندرویدی که می خواهید، با بهترین کیفیت و آخرین تکنولوژی های روز تولید کنید. این دوره طوری طراحی شده که تمام نیازهای بازار کار را پاسخگو می باشد. زبان برنامه نویسی استفاده شده در این دوره جاواست که بهینه ترین، پر سرعت ترین و با کیفیت ترین اپ های اندروید را با آن می توان تولید کرد و گوگل این روش را با آخرین به روزرسانی ها به بهترین شکل پشتیبانی می کند. برای گذراندن این دوره، نیاز به تجربه برنامه نویسی پیشرفته ندارید، ما سعی کردیم اکثر مفاهیم مورد نیاز شما را در جلسات ابتدایی آموزش دهیم. این دوره نیز بر اساس اصل قیمت گذاری منصفانه در سون لرن با هزینه ای بسیار کمتر از آنچه در دوره های حضوری می پردازید در دسترس شما خواهد بود.

- - , .
.

در این مطلب با ادامه آموزش Google Maps در خدمتتون هستیم.

در جلسه قبل در مورد قرار دادن Marker بر روی نقشه و همچنین دادن افکت انیمیشنی به اون براتون توضیح دادیم. در این جلسه قصد داریم کارای دیگه رو با Marker انجام بدیم.

در ابتدا بار دیگه نشانگر پیش فرض رو به شما نشون میدیم:

گوگل به شما اجازه میده که نشانه پیش فرض اون رو دستکاری کنید و هر آیکونی که خودتون دوست دارید رو جای اون قرار بدید. برای اینکار باید از ویژگی icon استفاده کنیم و آدرس اون شکلی که میخایم جای نشانگر پیش فرض قرار بگیره رو مشخص کنیم. برای اینکار بصورت زیر عمل میکنیم:

همونطور که دیدید مقابل ویژگی icon آدرس یک تصویر رو قرار دادیم که همون لوگوی سون لرن هست. خروجی بصورت زیر میشه:

اگه دقت کرده باشید با درگ کردن آیکون با نقشه تکون میخوره و نمیشه اون رو بر روی نقشه تغییر مکان داد. اگر بخواید کاری کنید که قابلیت درگ شدن به نشانگر اضافه بشه، باید از ویژگی draggable استفاده کنید و مقدار اون رو برابر با true قرار بدین. برای اینکار بصورت زیر عمل میکنیم:

خروجی بصورت زیر میشه:

میبینید که با گرفتن آیکون و کشیدن اون، میتونین آیکون رو به نقاط مختلفی جابجا کنید و در اونجا مستقرش کنید.

حالا مثلا میخایم کاری کنیم که با زدن بر روی دکمه های مختلف آیکون رو اضافه و حذف کنیم. برای اینکار بصورت زیر عمل میکنیم:

خروجی بصورت زیر میشه:

همونطور که دیدید با کلیک بر روی Add Marker یک آیکون اضافه میشه و با کلیک بر روی Remove Marker آیکون اضافه شده حذف میشه. این کار رو با استفاده از متد setMap انجام دادیم. برای حذف کردن این آیکون کافیه که برای نشانگر، نقشه ای که میخاد در اون نمایش داده بشه رو مشخص نکنیم. برای اینکار درون این متد null رو قرار میدیم. هر زمان که خواستیم این نشانگر برای این نقشه قرار داده بشه، نقشه مورد نظر یا همون متغیر map رو درون این متد قرار میدیم.

در جلسات بعدی بیشتر در مورد این ابزار قدرتمند گوگل صحبت میکنیم.

امیدوارم از این جلسه خوشتون اومده باشه.

موفق باشید

یا علی

Source

- - , .
.

به نام خدا و سلام. در اکثر افزونه های vip ما دلمون میخواد خودمون دستی بتونیم کاربری رو از سیستم حذف کنیم و یا حتی کاربری رو بدون پرداخت پول در سیستم ویژه عضو اضافه کنیم. خوب ما این موارد رو به راحتی می تونیم با کدنویسی برای افزونه امون مهیا کنیم. در این قسمت ما به این ویژگی خواهیم پرداخت و مراحل 0 تا صد اون رو انجام میدیم. در ابتدا برای حذف کردن کاربر یک اکشن ایجاد می کنیم و آیدی کاربر رو هم داخلش قرار میدیم و در صفحه سمت سرور چک می کنیم اگه این اکشن ست شده بود ما اون کاربر رو حذف می کنیم. در قسمت اضافه کردن هم یک لینک ایجاد می کنیم که این لینک ما رو به صفحه ای هدایت می کنه که لیست کاربران و انواع عضویت های ما اونجا قرار داره و ما باید گزینه های مورد نظر رو انتخاب کنیم و سپس دکمه ذخیره رو بزنیم تا کاربر ما به سیستم اضافه بشه. در این جلسه خواهیم دید:

• ایجاد بخش حذف کردن کاربران از عضویت ویژه
• ایجاد صفحه اضافه کردن کاربر جدید
• دریافت لیست کاربران با کدهای SQL
• دریافت لیست طرح های ویژه سایت با کدهای SQL
• تبدیل تعداد روز به تاریخ قابل ذخیره در MySQL
• ذخیره نهایی کاربر در سیستم

توضیحات : وردپرس به عنوان محبوب ترین سیستم مدیریت محتوا در بین اکثر کاربران فضای مجازی به خوبی شناخته شده است و این موضوع باعث شده تا سیستم های مختلفی برای وردپرس تهیه و به بازار عرضه شود. هر چند وردپرس خود رایگان است اما قابلیت های توسعه آن از جمله قالب ها و پلاگین ها که به کاربران کمک می کند سیستم مورد نظر خود را پیاده سازی کنند، باعث شده است تا رونق بسیار زیادی در بازار فروش قالب ها و پلاگین های آن ایجاد شود. فروش هایی که تا دهها میلیون دلار هم برای یک افزونه می رسد! در این دوره سعی کرده ایم تمامی مواردی که شما برای تهیه یک پلاگین عالی و کاملا حرفه ای نیاز دارد را قرار دهیم و تدریس نماییم. آموزش ها به صورت کاملا پروژه محور و کاربردی تهیه شده است، پلاگین هایی حرفه ای که هم نحوه ایجاد و کدنویسی آنها را یاد خواهید گرفت و هم آنها را در پایان دوره خواهید داشت. شما پس از گذراندن این دوره قادر خواهید بود هر نوع پلاگین دلخواه دیگری را که فکر می کنید برای سایت خود بنویسید. لازم به ذکر است در صورت سفارش پلاگین های طراحی و کدنویسی شده در این دوره، باید هزینه ای حداقل 800 هزارتومانی بپردازید! در صورتی که در این دوره شما فقط با پرداخت هزینه ای اندک، هم پلاگین نویسی حرفه ای خواهید شد و هم این پلاگین ها را در پایان دوره خواهید داشت. تدریس مباحث این دوره نیز به مانند دوره های دیگر سون لرن، بر اساس اصل صداقت در تدریس و جامع بودن دوره هاست و مدرس تمامی تجربیات حرفه ای خود در این زمینه را به شما انتقال خواهد داد! به جرئت می توانیم ادعا کنیم دوره حاضر حرفه ای ترین و استانداردترین دوره پلاگین نویسی وردپرس است که در سطح ایران برگزار می گردد. پس فرصت را از دست ندهید و خود را به یک پلاگین نویس حرفه ای وردپرس تبدیل کنید!

- - , .
.

دوستان سلام. توی این جلسه در مورد این صحبت می کنیم که چطور اپ اندرویدی خودمون رو روی شبیه ساز Genymotion یا دستگاه واقعی تست بکنیم. مطالب مطرح شده در این جلسه عبارتند از :

• معرفی نرم افزار Genymotion
• آموزش نصب Genymotion
• اضافه کردن شبیه ساز در Genymotion
• آموزش تست اپ روی دستگاه واقعی
• Adb چیست؟
• دانلود و نصب Adb Driver
• فعال کردن قابلیت Developer options
• تست کردن اپ روی دستگاه واقعی با Usb

توضیحات : سیستم عامل اندروید، با بیش از یک میلیارد کاربر در دنیا بالغ بر 70 درصد سهم سیستم عامل های تلفن های همراه را به خود اختصاص داده است. همین موضوع باعث شده تا بازار کاری با پتانسیل بالا برای برنامه نویسی اندروید ایجاد گردد. با توجه به استقبال کاربران و درخواست های مکرر شما دوستان عزیز سعی کردیم دوره ای جامع و کامل را در زمینه برنامه نویسی اندروید برگزار نماییم. در این دوره تمامی مفاهیم مقدماتی تا پیشرفته اندروید را به صورت کاملا پروژه محور آموزش خواهیم داد. پس از گذراندن این دوره می توانید هر برنامه و اپ اندرویدی که می خواهید، با بهترین کیفیت و آخرین تکنولوژی های روز تولید کنید. این دوره طوری طراحی شده که تمام نیازهای بازار کار را پاسخگو می باشد. زبان برنامه نویسی استفاده شده در این دوره جاواست که بهینه ترین، پر سرعت ترین و با کیفیت ترین اپ های اندروید را با آن می توان تولید کرد و گوگل این روش را با آخرین به روزرسانی ها به بهترین شکل پشتیبانی می کند. برای گذراندن این دوره، نیاز به تجربه برنامه نویسی پیشرفته ندارید، ما سعی کردیم اکثر مفاهیم مورد نیاز شما را در جلسات ابتدایی آموزش دهیم. این دوره نیز بر اساس اصل قیمت گذاری منصفانه در سون لرن با هزینه ای بسیار کمتر از آنچه در دوره های حضوری می پردازید در دسترس شما خواهد بود.

- - , .
.

به نام خدا. سلام، در این جلسه با مفاهیم اکتیویتی و اینتنت آشنا می شویم. در مورد چرخه ی زندگی یک اکتیویتی صحبت می کنیم. همچنین با انواع اینتنت ها ( Implicit و Expilicit ) آشنا خواهیم شد.

• آموزش اضافه کردن Activity
• آشنایی با Lifecycle اکتیویتی
  • onCreate
  • onStart
  • onResume
  • onPause
  • onStop
  • onDestroy
• Intent چیست؟
• استفاده از Intent برای رفتن به Activity دیگر

توضیحات : سیستم عامل اندروید، با بیش از یک میلیارد کاربر در دنیا بالغ بر 70 درصد سهم سیستم عامل های تلفن های همراه را به خود اختصاص داده است. همین موضوع باعث شده تا بازار کاری با پتانسیل بالا برای برنامه نویسی اندروید ایجاد گردد. با توجه به استقبال کاربران و درخواست های مکرر شما دوستان عزیز سعی کردیم دوره ای جامع و کامل را در زمینه برنامه نویسی اندروید برگزار نماییم. در این دوره تمامی مفاهیم مقدماتی تا پیشرفته اندروید را به صورت کاملا پروژه محور آموزش خواهیم داد. پس از گذراندن این دوره می توانید هر برنامه و اپ اندرویدی که می خواهید، با بهترین کیفیت و آخرین تکنولوژی های روز تولید کنید. این دوره طوری طراحی شده که تمام نیازهای بازار کار را پاسخگو می باشد. زبان برنامه نویسی استفاده شده در این دوره جاواست که بهینه ترین، پر سرعت ترین و با کیفیت ترین اپ های اندروید را با آن می توان تولید کرد و گوگل این روش را با آخرین به روزرسانی ها به بهترین شکل پشتیبانی می کند. برای گذراندن این دوره، نیاز به تجربه برنامه نویسی پیشرفته ندارید، ما سعی کردیم اکثر مفاهیم مورد نیاز شما را در جلسات ابتدایی آموزش دهیم. این دوره نیز بر اساس اصل قیمت گذاری منصفانه در سون لرن با هزینه ای بسیار کمتر از آنچه در دوره های حضوری می پردازید در دسترس شما خواهد بود.

- - , .
.

در این مطلب میخوام سایتی رو بهتون معرفی کنم که بهمراه ساخت یک منو، کل مفاهیم و اصول CSS Box Model رو به شما آموزش میده و شما رو با اون بصورت کامل آشنا میکنه. همونطور که میدونید Box Model از 4 بخش Content و padding و border و margin ساخته شده. در این آموزش همچنین در مورد ویژگی های CSS مرتبط همچون box-sizing هم آموزش داده شده و شما رو با کاربرد اون آشنا میکنه.

برای شروع وارد سایت box-model بشین.

امیدوارم بدردتون بخوره.

موفق باشید.

یا علی

- - , .
.

در این مطلب با ادامه آموزش Google Maps در خدمتتون هستیم.

در جلسات قبلی دوستان زیادی درخواست کرده بودن که چطور میتونیم موقعیت خودمون رو درون نقشه گوگل تغییر بدیم و همون مکانی که قصد داریم رو به کاربران نمایش بدیم. برای این کار سایتهای زیادی وجود داره و همه اونا میتونه کار شما رو راه بندازه ولی در این مطلب یکی از بهترین سایتهای در این زمینه رو خدمت شما معرفی میکنم. سایتی که در این مطلب به آموزش اون میپردازیم، سایت MyGeoPosition هست. این سایت قابلیتهای زیادی رو داره و در این آموزش به تعدادی از قابلیتهای اون اشاره میکنیم.

در ابتدا که وارد سایت میشیم، یک نقشه در سایت وجود داره و همچنین در بالای سایت input و تب هایی قرار داره. در ابتدا تب Map فعال هست:

1. درون این باکس اطلاعات نقطه ای که Marker در اونجا قرار داره رو مشخص میکنه. همونطور که میبینید سه تا ویژگی رو خدمت شما میزاره که فقط 2 تای اولی در اینجا بدرد ما میخوره. در بالای این باکس هم آدرس اون نقطه رو قرار داده. ویژگی Latitude همون عرض جغرافیایی و Longitude همون طول جغرافیایی هست.
2. شما اگه آدرس دقیق نقطه مورد نظرتون رو داشته باشید، میتونین با وارد کردن آدرس در این Input و کلیک بر روی دکمه Calculate GeoData، اطلاعات جغرافیایی اون نقطه رو بدست بیارید.
3. این علامت همون Marker یا نشانه ما هست که میتونیم با استفاده از Drag و Drop کردن ماوس اون رو جابجا کنیم. این Marker در هر جا قرار بگیره و هر دفعه که اون رو تغییر مکان میدین، اطلاعات اون هم به نسبت عوض میشه و اطلاعات اون نقطه رو در باکس نمایش میده.

همونطور که در تصویر بالا دیدید اطلاعات نقطه ای در لندن مشخص شده. حالا من میخام برای مثال کاری کنم که موقعیت حرم مطهر شاهچراغ در شیراز رو مشخص کنم و عرض و طول جغرافیایی اون رو بدست بیارم. برای اینکار در ابتدا خیلی بزرگنمایی رو کم میکنیم تا بتونیم از قاره اروپا به قاره آسیا و کشور ایران بریم:

همونطور که دیدید با استفاده از فلش مشخص کردیم که مبدا و مقصد کجاس. حالا بر روی کشور ایران بزرگنمایی میکنیم تا به شهر شیراز برسیم و حرم مطهر شاهچراغ رو پیدا میکنیم:

حالا اگه بخایم Marker رو در این نقطه قرار بدیم و اطلاعات اون رو بدست بیاریم، باید روی نقطه مورد نظر کلیک راست کنید. با این کار Marker به این نقطه منتقل میشه و اطلاعات نقطه مورد نظر رو به ما میده:

میبینید که Marker قرار گرفته و اطلاعات رو به ما داده. حالا تنها کاری که باید بکنید اینه که اطلاعات رو کپی کنید. برای اینکار بعد از اینکه Marker رو در نقطه مورد نظر قرار دادید، بر روی دکمه Copy که در تصویر بالا مشخص کردم، کلیک کنید. با اینکار اطلاعات این نقطه در حافظه موقت قرار میگیره. اگر اون رو در جایی کپی کنید، چیزی بصورت زیر خواهد شد:

میبینید که دو عدد با تعداد ارقام اعشار زیاد که با استفاده از کاما از هم جدا شده اند رو به شما داده. حالا تنها کاری که کافیه انجام بدین اینه که این اطلاعات رو در google.maps.LatLng قرار بدین. با اینکار کدتون بصورت زیر میشه:

خروجی هم بصورت زیر خواهد بود:

میبینید که نقطه ای که مشخص کردیم در مرکز نقشه خودمون قرار گرفته. دیدید که چه راحت میتونیم این کارو انجام بدیم. این سایت امکانات دیگه ای رو هم داره که خودتون میتونین با اونا کار کرده و یاد بگیرید.

در جلسات بعدی بیشتر در مورد این ابزار قدرتمند گوگل صحبت میکنیم.

امیدوارم از این جلسه خوشتون اومده باشه.

موفق باشید

یا علی

Source

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300);

body {

color: #333;

font-family: 'Open Sans', sans-serif;

font-weight: 300;

}

h1,

h1+p {

margin: 30px 15px 0;

font-weight: 300;

}

h1+p a {

color: #333;

}

h1+p a:hover {

text-decoration: none;

}

h2 {

margin: 60px 15px 0;

padding: 0;

font-weight: 300;

}

h2 span {

margin-left: 1em;

color: #aaa;

font-size: 85%;

}

.column {

margin: 15px 15px 0;

padding: 0;

}

.column:last-child {

padding-bottom: 60px;

}

.column::after {

content: '';

clear: both;

display: block;

}

.column div {

position: relative;

float: left;

width: 300px;

height: 200px;

margin: 0 0 0 25px;

padding: 0;

}

.column div:first-child {

margin-left: 0;

}

.column div span {

position: absolute;

bottom: -20px;

left: 0;

z-index: -1;

display: block;

width: 300px;

margin: 0;

padding: 0;

color: #444;

font-size: 18px;

text-decoration: none;

text-align: center;

-webkit-transition: .3s ease-in-out;

transition: .3s ease-in-out;

opacity: 0;

}

figure {

width: 300px;

height: 200px;

margin: 0;

padding: 0;

background: #fff;

overflow: hidden;

}

figure:hover+span {

bottom: -36px;

opacity: 1;

}

/* Shine */

.hover14 figure {

position: relative;

}

.hover14 figure::before {

position: absolute;

top: 0;

left: -75%;

z-index: 2;

display: block;

content: '';

width: 50%;

height: 100%;

background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%);

background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%);

-webkit-transform: skewX(-25deg);

transform: skewX(-25deg);

}

.hover14 figure:hover::before {

-webkit-animation: shine .75s;

animation: shine .75s;

}

@-webkit-keyframes shine {

100% {

left: 125%;

}

}

@keyframes shine {

100% {

left: 125%;

}

}

به نام خدا و سلام. با جلسه 27 ام از دوره مجازی پلاگین نویسی در خدمت شما هستیم. در این جلسه قصد داریم تا مدیریت کاربران در پلاگین vip رو آموزش بدیم. در ابتدا لیست کاربران رو با توجه به جدول vip_users که قبلا ایجاد کردیم دریافت می کنیم و توضیحاتی در مورد روش های مختلف این کار چه با استفاده از WP_User_Query و چه با روش JOIN کردن جدول های وردپرس به شما خواهیم گفت.سپس توضیحات کامل تری در مورد WP_User_Query و اینکه چطوری میشه از این کلاس برای دریافت داده های کاربران و هم چنین فیلتر کردن داده ها استفاده کرد رو میگیم. در انتها داده ها دریافتی با روش های بالا رو در صفحه کاربران نمایش میدیم. در این جلسه خواهیم دید :

• پیاده سازی زیر منوی کاربران
• آموزش WP_User_Query
• دریافت لیست داده های کاربران
• فیلتر کردن برخی داده ها

توضیحات : وردپرس به عنوان محبوب ترین سیستم مدیریت محتوا در بین اکثر کاربران فضای مجازی به خوبی شناخته شده است و این موضوع باعث شده تا سیستم های مختلفی برای وردپرس تهیه و به بازار عرضه شود. هر چند وردپرس خود رایگان است اما قابلیت های توسعه آن از جمله قالب ها و پلاگین ها که به کاربران کمک می کند سیستم مورد نظر خود را پیاده سازی کنند، باعث شده است تا رونق بسیار زیادی در بازار فروش قالب ها و پلاگین های آن ایجاد شود. فروش هایی که تا دهها میلیون دلار هم برای یک افزونه می رسد! در این دوره سعی کرده ایم تمامی مواردی که شما برای تهیه یک پلاگین عالی و کاملا حرفه ای نیاز دارد را قرار دهیم و تدریس نماییم. آموزش ها به صورت کاملا پروژه محور و کاربردی تهیه شده است، پلاگین هایی حرفه ای که هم نحوه ایجاد و کدنویسی آنها را یاد خواهید گرفت و هم آنها را در پایان دوره خواهید داشت. شما پس از گذراندن این دوره قادر خواهید بود هر نوع پلاگین دلخواه دیگری را که فکر می کنید برای سایت خود بنویسید. لازم به ذکر است در صورت سفارش پلاگین های طراحی و کدنویسی شده در این دوره، باید هزینه ای حداقل 800 هزارتومانی بپردازید! در صورتی که در این دوره شما فقط با پرداخت هزینه ای اندک، هم پلاگین نویسی حرفه ای خواهید شد و هم این پلاگین ها را در پایان دوره خواهید داشت. تدریس مباحث این دوره نیز به مانند دوره های دیگر سون لرن، بر اساس اصل صداقت در تدریس و جامع بودن دوره هاست و مدرس تمامی تجربیات حرفه ای خود در این زمینه را به شما انتقال خواهد داد! به جرئت می توانیم ادعا کنیم دوره حاضر حرفه ای ترین و استانداردترین دوره پلاگین نویسی وردپرس است که در سطح ایران برگزار می گردد. پس فرصت را از دست ندهید و خود را به یک پلاگین نویس حرفه ای وردپرس تبدیل کنید!

در این مطلب نمونه 13 برای هاور بر تصاویر با عنوان CSS Image Hover رو در اختیارتون قرار میدم. امیدوارم که بتونین از اون ایده بگیرید و یا اینکه از اون در سایتتون استفاده کنید.

کد HTML :

کد CSS :

امیدوارم خوشتون بیاد.

موفق باشید. یا علی

Source

در این مطلب میخوام سایتی رو بهتون معرفی کنم که در اون یک ابزار Javascript قرار داده شده که با استفاده از اون میتونین بلاکهای با عرض ثابت و ارتفاع متفاوت رو در کنار همدیگه قرار بدین. این ابزار از تکنولوژی های جدید استفاده کرده و خیلی خیلی سریع هست و در زمان کمی میتونه این کار رو برای شما انجام بده. این ابزار نیازی به CSS نداره و خودش همه کارا رو انجام میده.

برای شروع وارد سایت bricks-js بشین.

امیدوارم بدردتون بخوره.

موفق باشید.

یا علی

در این مطلب میخوام سایتی رو بهتون معرفی کنم که طراحی زیبا و فوق العاده ای داره در بیشتر جاهای اون از افکت چسبان یا Gooey Effect استفاده شده. برای مثال اگه بر روی آیکون سه خط یا همبرگر در بالای سایت مورد نظر کلیک کنید، منوها به زیبایی باز میشن. همچنین اگر بر روی ANIMAL کلیک کنید، یک آهنگ پخش میشه و حیوانات شروع به جنب و جوش میکنن.

برای شروع وارد سایت animalmade بشین.

امیدوارم بدردتون بخوره.

موفق باشید.

یا علی

@import url(http://fonts.googleapis.com/css?family=Martel+Sans:200,300,400,800,900);

*,

*:before,

*:after {

-webkit-box-sizing: border-box;

-moz-box-sizing: border-box;

box-sizing: border-box;

}

body {

font-family: 'Martel Sans', sans-serif;

background-color: #000;

}

section {

height: 350px;

width: 94%;

box-shadow: 0px 0px 146px 21px rgba(0, 0, 0, 0.75);

background-color: #000;

background-repeat: no-repeat;

background-size: cover;

background-position: center center;

position: relative;

overflow: hidden;

width: 100%;

margin: 0 auto 0px;

}

section a {

text-transform: uppercase;

text-align: center;

text-decoration: none;

font-size: 4.875em;

font-weight: 900;

color: #fff;

}

section a:after, section a:before {

content: '';

}

section.p18 {

background-image: url("9.jpg");

}

section.p18 a {

text-align: left;

width: 491px;

height: 94px;

line-height: 94px;

position: absolute;

top: 50%;

left: 50%;

margin-left: -245.5px;

margin-top: -47px;

font-size: 3.87500em;

}

section.p18 a:before, section.p18 a:after {

content: '';

position: absolute;

background-color: rgba(255, 255, 255, 0.8);

width: 46px;

height: 65px;

left: -46px;

top: -12%;

}

section.p18 a:before {

-webkit-clip-path: polygon(0 35%, 100% 43%, 100% 100%);

clip-path: polygon(0 35%, 100% 43%, 100% 100%);

}

section.p18 a:after {

-webkit-clip-path: polygon(13% 0, 100% 43%, 100% 100%);

clip-path: polygon(13% 0, 100% 43%, 100% 100%);

}

section.p18 a:hover:before {

-webkit-animation: voavoa 0.1s infinite linear;

-moz-animation: voavoa 0.1s infinite linear;

animation: voavoa 0.1s infinite linear;

}

section.p18 a:hover:after {

-webkit-animation: voavoa2 0.1s infinite linear;

-moz-animation: voavoa2 0.1s infinite linear;

animation: voavoa2 0.1s infinite linear;

}

@-webkit-keyframes voavoa {

from {

-webkit-clip-path: polygon(0 35%, 100% 43%, 100% 100%);

clip-path: polygon(0 35%, 100% 43%, 100% 100%);

}

to {

-webkit-clip-path: polygon(13% 0, 100% 43%, 100% 100%);

clip-path: polygon(13% 0, 100% 43%, 100% 100%);

}

}

@-moz-keyframes voavoa {

from {

-webkit-clip-path: polygon(0 35%, 100% 43%, 100% 100%);

clip-path: polygon(0 35%, 100% 43%, 100% 100%);

}

to {

-webkit-clip-path: polygon(13% 0, 100% 43%, 100% 100%);

clip-path: polygon(13% 0, 100% 43%, 100% 100%);

}

}

@keyframes voavoa {

from {

-webkit-clip-path: polygon(0 35%, 100% 43%, 100% 100%);

clip-path: polygon(0 35%, 100% 43%, 100% 100%);

}

to {

-webkit-clip-path: polygon(13% 0, 100% 43%, 100% 100%);

clip-path: polygon(13% 0, 100% 43%, 100% 100%);

}

}

@-webkit-keyframes voavoa2 {

from {

-webkit-clip-path: polygon(13% 0, 100% 43%, 100% 100%);

clip-path: polygon(13% 0, 100% 43%, 100% 100%);

}

to {

-webkit-clip-path: polygon(0 45%, 100% 43%, 100% 100%);

clip-path: polygon(0 45%, 100% 43%, 100% 100%);

}

}

@-moz-keyframes voavoa2 {

from {

-webkit-clip-path: polygon(13% 0, 100% 43%, 100% 100%);

clip-path: polygon(13% 0, 100% 43%, 100% 100%);

}

to {

-webkit-clip-path: polygon(0 45%, 100% 43%, 100% 100%);

clip-path: polygon(0 45%, 100% 43%, 100% 100%);

}

}

@keyframes voavoa2 {

from {

-webkit-clip-path: polygon(13% 0, 100% 43%, 100% 100%);

clip-path: polygon(13% 0, 100% 43%, 100% 100%);

}

to {

-webkit-clip-path: polygon(0 45%, 100% 43%, 100% 100%);

clip-path: polygon(0 45%, 100% 43%, 100% 100%);

}

}

به نام خدا و سلام. در خدمت شما هستیم با جلسه 26 ام از دوره مجازی پلاگین نویسی حرفه ای وردپرس. در این قسمت قصد داریم تا کدهای مربوط به بخش مدیریت محصولات پلاگین vip رو بنویسیم. در ابتدا قسمت ویرایش یک محصول رو ایجاد می کنیم و برای این کار نیاز داریم تا صفحه اضافه کردن محصول رو ویرایش کنیم (چون از همون صفحه برای ویرایش محصول استفاده می کنیم) و در ادامه هم بخش حذف کردن یک محصول رو رو پیاده سازی می کنیم. روش هایی که در این جلسه آموزش داده میشه میتونه الگویی برای تمام بخش های دیگه پلاگین vip ما باشه پس لطفا با دقت تمام بهش توجه کنید. در این جلسه خواهیم دید :

• پیرایش صفحه اضافه کردن محصول
• پیاده سازی بخش ویرایش یک محصول و معرفی تابع add_query_arg
• پیاده سازی بخش حذف کردن یک محصول

توضیحات : وردپرس به عنوان محبوب ترین سیستم مدیریت محتوا در بین اکثر کاربران فضای مجازی به خوبی شناخته شده است و این موضوع باعث شده تا سیستم های مختلفی برای وردپرس تهیه و به بازار عرضه شود. هر چند وردپرس خود رایگان است اما قابلیت های توسعه آن از جمله قالب ها و پلاگین ها که به کاربران کمک می کند سیستم مورد نظر خود را پیاده سازی کنند، باعث شده است تا رونق بسیار زیادی در بازار فروش قالب ها و پلاگین های آن ایجاد شود. فروش هایی که تا دهها میلیون دلار هم برای یک افزونه می رسد! در این دوره سعی کرده ایم تمامی مواردی که شما برای تهیه یک پلاگین عالی و کاملا حرفه ای نیاز دارد را قرار دهیم و تدریس نماییم. آموزش ها به صورت کاملا پروژه محور و کاربردی تهیه شده است، پلاگین هایی حرفه ای که هم نحوه ایجاد و کدنویسی آنها را یاد خواهید گرفت و هم آنها را در پایان دوره خواهید داشت. شما پس از گذراندن این دوره قادر خواهید بود هر نوع پلاگین دلخواه دیگری را که فکر می کنید برای سایت خود بنویسید. لازم به ذکر است در صورت سفارش پلاگین های طراحی و کدنویسی شده در این دوره، باید هزینه ای حداقل 800 هزارتومانی بپردازید! در صورتی که در این دوره شما فقط با پرداخت هزینه ای اندک، هم پلاگین نویسی حرفه ای خواهید شد و هم این پلاگین ها را در پایان دوره خواهید داشت. تدریس مباحث این دوره نیز به مانند دوره های دیگر سون لرن، بر اساس اصل صداقت در تدریس و جامع بودن دوره هاست و مدرس تمامی تجربیات حرفه ای خود در این زمینه را به شما انتقال خواهد داد! به جرئت می توانیم ادعا کنیم دوره حاضر حرفه ای ترین و استانداردترین دوره پلاگین نویسی وردپرس است که در سطح ایران برگزار می گردد. پس فرصت را از دست ندهید و خود را به یک پلاگین نویس حرفه ای وردپرس تبدیل کنید!

در این مطلب میخوام سایتی رو بهتون معرفی کنم که در اون بصورت کامل فرآیند طراحی لوگوی Arriva رو قرار داده و شما میتونین از اون چیزهای زیادی رو یاد بگیرید. این آموزش به نکات کلی که شما باید در مورد اونا اطلاع داشته باشید، اشاره کرده.

برای شروع وارد سایت Arriva-logo بشین.

امیدوارم بدردتون بخوره.

موفق باشید.

یا علی

در این مطلب با ادامه آموزش Google Maps در خدمتتون هستیم.

در جلسه قبل توضیحاتی در مورد روش فعال و غیر فعال کردن کنترلرهای Google Maps دادیم و در این جلسه مباحث رو جلو میبریم.

برای اینکه کنترلر Zoom رو بردارید باید بصورت زیر عمل کنید:

خروجی بصورت زیر هست:

همونطوری که در تصویر مشخص شده، دیگه اون کنترلر بزرگنمایی که + و - داشت، وجود نداره و برداشته شده.

میزان بزرگنمایی یا Scale در حالت اولیه بر روی نقشه نمایش داده نمیشه. برای اینکه میزان بزرگنمایی رو بر روی نقشه قرار بدیم باید بصورت زیر عمل کنیم:

خروجی بصورت زیر هست:

همونطور که در تصویر بالا مشخص کردیم، یک بخش بزرگنمایی به پایین نقشه اضافه شده و بزرگنمایی کنونی نقشه رو نمایش میده. همونطور که میبینید یک اندازه رو مشخص کرده و گفته این اندازه بر روی نقشه معادل با 5 کیلومتر واقعی هست. اگر بر روی مقیاس کلیک کنید واحدها عوض میکشن و بجای نمایش km و m واحدهای mi و ft نمایش داده میشه. km و m و mi و ft به ترتیب به معنای کیلومتر، متر، مایل و فوت هستند.

حالا میخایم اون قسمتی که در بالا و سمت چپ قرار داره و میشه با استفاده از اون نوع نقشه رو تغییر داد، مخفی کنیم و همچنین اون آدمک یا Street View که در سمت راست هست رو برداریم. برای اینکار بصورت زیر عمل میکنیم:

خروجی بصورت زیر هست:

همونطور که در تصویر بالا میبینید ویژگی های Street View و Map type مخفی شدن.

اگر بخوام شما رو با کاربرد Street View آشنا کنم، باید مثالی رو براتون بزنم. اول اینکه از این ویژگی فقط در نقاطی که عکسی از اون نقطه در Google Maps وجود داره، میتونین استفاده کنید. برای اینکه بفهمید چه نقاطی بر روی نقشه از این ویژگی پشتیبانی میکنن، اون آدمک رو با ماوس گرفته و بر روی نقشه درگ کنید، اما ماوس رو رها نکنید و منتظر بمونید تا مناطق پشتیبانی کننده رنگشون عوض بشه:

میبینید که ما آدمک رو درگ کردیم و بدون رها کردن ماوس، اون رو روی نقشه نگه داشتیم. همونطور که مشاهده میکنید، یک سری از نقاط به رنگ آبی در اومدن. رنگهای آبی به معنای اونه که در Google Maps برای این نقاط تصاویر پانورما و 360 درجه ای قرار داده شده. شما میتونین آدمک رو روی یکی از اونا نگه دارید و رها کنید:

برای مثال من آدمک رو بر روی حرم مطهر شاهچراغ بردم و میبینید که یه تصویر اولیه رو بهم نشون میده و زیر اون هم نام عکاس رو که Omid Jafaezhad هست قرار میده. حالا اگر آدمک رو رها کنیم وارد تصویر 360 درجه ای مربوط به حرم مطهر میشیم:

همونطور که دیدید وارد تصویر پانورما شدیم، حالا میتونیم با نگه داشتن کلیک ماوس و درگ کردن، کل محوطه حرم و اطراف رو ببینید. در تصویر اعدادی قرار داده شده که بصورت زیر هستند:

1. برگشت به نقشه اصلی
2. تمام صفحه کردن
3. جهت قطب نما

با استفاده از ویژگی Street View میتونین به کل جهان سفر کنید و خیابون ها و مکانهای مختلف رو ببینید و یا حتی میتونید به سایت اصلی Google Map برید و خودتون یک تصویر از مکان مورد نظرتون قرار بدین.

در جلسات بعدی بیشتر در مورد این ابزار قدرتمند گوگل صحبت میکنیم.

امیدوارم از این جلسه خوشتون اومده باشه.

موفق باشید

یا علی

Source